<template>
  <div class="list" >
        <div class="imgbox">
          <img src="https://gimg2.baidu.com/image_search/src=http%3A%2F%2Fc-ssl.duitang.com%2Fuploads%2Fblog%2F202105%2F04%2F20210504062111_d8dc3.thumb.1000_0.jpg&refer=http%3A%2F%2Fc-ssl.duitang.com&app=2002&size=f9999,10000&q=a80&n=0&g=0n&fmt=auto?sec=1668340729&t=484dc3efda63f18eab1bf3a5555e41fd" alt="">
        </div>
        <div class="text">
          <h3>{{item.name}}</h3>
          <span>月销:{{item.yuxiao}}</span>
          <span>好评:{{item.haoping}}</span>
        </div>
</div>
</template>

<script>
export default {
    data(){
    return {
      lists:[
    {tabname:"热销",
    list:[
      {pic:"",name:"热销商品1",yuxiao:456,haoping:444},
      {pic:"",name:"热销商品2",yuxiao:456,haoping:444},
      {pic:"",name:"热销商品3",yuxiao:456,haoping:444},
    ]},
    {tabname:"优惠",
    list:[
      {pic:"",name:"优惠商品1",yuxiao:456,haoping:444},
      {pic:"",name:"优惠商品2",yuxiao:456,haoping:444},
      {pic:"",name:"优惠商品3",yuxiao:456,haoping:444},
    ]},
    {tabname:"三文鱼",
    list:[
      {pic:"",name:"三文鱼商品1",yuxiao:456,haoping:444},
      {pic:"",name:"三文鱼商品2",yuxiao:456,haoping:444},
      {pic:"",name:"三文鱼商品3",yuxiao:456,haoping:444},
    ]},
    {tabname:"刺身",
    list:[
      {pic:"",name:"刺身商品1",yuxiao:456,haoping:444},
      {pic:"",name:"刺身商品2",yuxiao:456,haoping:444},
      {pic:"",name:"刺身商品3",yuxiao:456,haoping:444},
    ]},
    {tabname:"礼品专区",
    list:[
      {pic:"",name:"礼品专区商品1",yuxiao:456,haoping:444},
      {pic:"",name:"礼品专区商品2",yuxiao:456,haoping:444},
      {pic:"",name:"礼品专区商品3",yuxiao:456,haoping:444},
    ]},
    {tabname:"大虾",
    list:[
      {pic:"",name:"大虾专区商品1",yuxiao:456,haoping:444},
      {pic:"",name:"大虾专区商品2",yuxiao:456,haoping:444},
      {pic:"",name:"大虾专区商品3",yuxiao:456,haoping:444},
    ]},
      ],
      indexs:0,
    }
  },
  methods:{
    gaoliang(index){
      this.indexs = index;
    }
  },
}
</script>

<style>
.imgbox{
    width: 130px;
    margin-top: 5px;
  }
   .imgbox>img{
    width: 100%;

   }
   .list{
    display: flex;
    margin: 10px 0;
   }
</style>